<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<script src="../../../../../../../vue2.0/dist/vue.js"></script>
	
	
	<!----------------------------------------------------------------------------------->
	<template id="tem">  <!--局部组件父组件模板-->
		 <div style="width: 200px;height: 200px; background: green;">
		 	<bbb>子组件</bbb>  <!--子组件放在父组件的模板元素中-->
        </div>
	</template>
	
	<template id="childtep">    <!--局部组件子组件模板-->
		<h2>11</h2>
	</template>
	<body>
		<div id="dv">
	   	   <aaa>
	   	   	  
	   	   </aaa>
	   </div>
	   
	    <div id="dv1">
	    	<qqq></qqq>
	    </div>
	</body>
	   
	<script>
		 new Vue({
		 	el:'#dv',
		 	components:{   //局部组件
		 		'aaa':{
		 			template:'#tem',
		 			components:{   //注册子组件
		 			      'bbb':{
		 			      	template:'<h2>11</h2>'
		 			      }
		 			}
		 		}
		 	}
		 })
		 
		 
		 
		   
	</script>
	     <!--定义父子组件步骤：
	     	0，实例化vue,绑定根组件
	        1、注册父组件；
	        2、注册子组件：
	                       当注册父子组件的时候，注册完父组件之后，子组件注册需要放置在父组件的template同级别的大括号当中；
	        3、子组件嵌套：
	                   子组件要放置在父组件的模板元素中-->
</html>
